
{{extend './layout.html'}}
{{block 'content'}}
  <div class="home-main">
    <div class="home-main-banner">
      <div class="swiper mySwiper">
        <div class="swiper-wrapper">
          <div class="swiper-slide">
            <div class="banner-content">
              <h2>JavaScript</h2>
              <h2>Vue</h2>
              <h2>算法</h2>
              <h2>笔记</h2>
            </div>
          </div>
        </div>
        <!-- <div class="swiper-pagination"></div> -->
      </div>
    </div>
    <div class="home-main-site">
      <div class="home-main-site-title">
        <span>学</span>
        <h3>学习</h3>
        <p>个人学习资料查询入口</p>
      </div>
      <ul class="home-main-site-ui">
        <li>
          <a href="http://shouce.jb51.net/es6/" target="_blank">
            <h3 class="color-green-gradient">ES6 文档</h3>
            <p>ES6它的目标，是使得JavaScript语言可以用来编写复杂的大型应用程序</p>
          </a>
        </li>
        <li>
          <a href="https://zh.javascript.info/" target="_blank">
            <h3 class="color-red-light">JavaScript</h3>
            <p>以最新的 JavaScript 标准为基准。通过简单但足够详细的内容，为你讲解从基础到高阶的 JavaScript 相关知识。</p>
          </a>
        </li>
        <li>
          <a href="https://developer.mozilla.org/zh-CN/docs/Web" target="_blank">
            <h3 class="color-yellow1">MDN</h3>
            <p>面向 Web 开发者的文档</p>
          </a>
        </li>
        <li>
          <a href="http://hemin.cn/jq/" target="_blank">
            <h3 class="color-9999CC">JQuery</h3>
            <p>Js 插件</p>
          </a>
        </li>
        <li>
          <a href="https://ts.xcatliu.com/" target="_blank">
            <h3 class="color-red-light3">TypeScript</h3>
            <p>TypeScript 是 JavaScript 的一个超集，主要提供了类型系统和对 ES6 的支持，</p>
          </a>
        </li>
        <li>
          <a href="http://www.webgl3d.cn/" target="_blank">
            <h3 class="color-pink-gradient">Three.js中文网</h3>
            <p>Three.js是一款基于原生WebGL封装通用Web 3D引擎</p>
          </a>
        </li>
        <li>
          <a href="https://leetcode.cn/" target="_blank">
            <h3 class="color-green-gradient">Leetcode</h3>
            <p>LeetBook - 力扣（LeetCode）全球极客挚爱的技术成长平台</p>
          </a>
        </li>
        <li>
          <a href="https://www.javascriptc.com/vue3js/" target="_blank">
            <h3 class="color-green-dark">Vue3</h3>
            <p>易学易用，性能出色，适用场景丰富的 Web 前端框架。</p>
          </a>
        </li>
        <li>
          <a href="https://vitejs.cn/vite3-cn/" target="_blank">
            <h3 class="color-green-gradient3">Vite</h3>
            <p>下一代的前端工具链</p>
          </a>
        </li>
        <li>
          <a href="https://vuex.vuejs.org/zh/" target="_blank">
            <h3 class="color-green">Vuex</h3>
            <p>Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式 + 库。</p>
          </a>
        </li>
        <li>
          <a href="https://pinia.web3doc.top/" target="_blank">
            <h3 class="color-yellow">Pinia</h3>
            <p>您将喜欢使用的 Vue 存储库</p>
          </a>
        </li>
        <li>
          <a href="http://mockjs.com/" target="_blank">
            <h3 class="color-blue-light2">Mockjs</h3>
            <p>生成随机数据，拦截 Ajax 请求</p>
          </a>
        </li>
        <li>
          <a href="https://vitepress.dev/zh/" target="_blank">
            <h3 class="color-red-light4">Vitepress</h3>
            <p>由 Vite 和 Vue 驱动的静态站点生成器,简单、强大、快速。就是你想要的现代 SSG 框架！</p>
          </a>
        </li>

        <li>
          <a href="https://www.nodeapp.cn/" target="_blank">
            <h3 class="color-green-deep">Node.js中文文档</h3>
            <p>Node.js中文网、 Node.js下载和API文档</p>
          </a>
        </li>
        <li>
          <a href="https://topgoer.com/" target="_blank">
            <h3 class="color-black1">GO 中文文档</h3>
            <p>go是非常年轻的一门语言</p>
          </a>
        </li>
        <li>
          <a href="https://nest.nodejs.cn/" target="_blank">
            <h3 class="color-red-deep2">Nest.js文档</h3>
            <p>Nest (NestJS) 是一个用于构建高效、可扩展的 Node.js 服务器端应用的框架。</p>
          </a>
        </li>
        <li>
          <a href="https://flutter.cn/docs" target="_blank">
            <h3 class="color-red">Flutter中文文档</h3>
            <p>Flutter中文文档</p>
          </a>
        </li>
        <li>
          <a href="https://www.mongodb.org.cn/" target="_blank">
            <h3 class="color-green-gradient4">Mongodb</h3>
            <p>基于分布式文件存储的数据库</p>
          </a>
        </li>
        <li>
          <a href="https://echarts.apache.org/zh/index.html" target="_blank">
            <h3 class="color-red-deep3">Echarts</h3>
            <p>基于 JavaScript 的开源可视化图表库</p>
          </a>
        </li>

        <li>
          <a href="https://element-plus.gitee.io/zh-CN/" target="_blank">
            <h3 class="color-blue-deep4">Element-plus</h3>
            <p>基于 Vue 3，面向设计师和开发者的组件库</p>
          </a>
        </li>
        <li>
          <a href="color-green-deep" target="_blank">
            <h3 class="color-green-gradient">微信官方文档</h3>
            <p>微信官方文档</p>
          </a>
        </li>
        <li>
          <a href="https://opendocs.alipay.com/mini/development" target="_blank">
            <h3 class="color-blue-deep">支付宝 Api</h3>
            <p>支付宝小程序文档</p>
          </a>
        </li>
        <li>
          <a href="https://www.dcloud.io/" target="_blank">
            <h3 class="color-green-dark">Uniapp</h3>
            <p>uni-app 是一个使用 Vue.js 开发所有前端应用的框架</p>
          </a>
        </li>
        <li>
          <a href="https://www.electronjs.org/" target="_blank">
            <h3 class="color-blue-darklight2">Electron.js文档</h3>
            <p>使用JavaScript、HTML和CSS构建跨平台桌面应用程序</p>
          </a>
        </li>
        <li>
          <a href="https://thinkjs.org/zh-cn" target="_blank">
            <h3 class="color-black2">Think.js</h3>
            <p>使用完整的ES6/7功能来开发Node.js应用程序。</p>
          </a>
        </li>
        <li>
          <a href="https://www.npmjs.com/" target="_blank">
            <h3 class="color-red">Npmjs</h3>
            <p>让您的JavaScript开发更上一层楼</p>
          </a>
        </li>
        <li>
          <a href="https://www.ucharts.cn/v2/#/" target="_blank">
            <h3 class="color-pink-gradient">Ucharts</h3>
            <p>高性能跨平台图表库,PC、H5、APP、小程序、Vue、Taro</p>
          </a>
        </li>
        <li>
          <a href="https://www.npmjs.com/package/mitt" target="_blank">
            <h3 class="color-orange-deep">Mitt</h3>
            <p>通信</p>
          </a>
        </li>
        <li>
          <a href="https://www.swiper.com.cn/" target="_blank">
            <h3 class="color-pink1">Swiper</h3>
            <p>开源、免费、强大的触摸滑动插件</p>
          </a>
        </li>
        <li>
          <a href="https://www.antdv.com/components/tree-cn" target="_blank">
            <h3 class="color-pink1">Ant Design Vue </h3>
            <p>开箱即用的高质量 Vue 组件。</p>
          </a>
        </li>
      </ul>
    </div>
    <div class="home-main-site">
      <div class="home-main-site-title">
        <span>工</span>
        <h3>工具</h3>
        <p>个人查询、练习、调试、测试工具入口</p>
      </div>
      <ul class="home-main-site-ui">
        <li>
          <a href="https://www.baidu.com/" target="_blank">
            <h3 class="color-blue">百度一下</h3>
            <p>搜索网址</p>
          </a>
        </li>
        <li>
          <a href="color-orange-deep" target="_blank">
            <h3 class="color-orange-dark">rem&vm计算</h3>
            <p>单位计算转换</p>
          </a>
        </li>
        <li>
          <a href="https://fanyi.baidu.com/" target="_blank">
            <h3 class="color-blue">百度翻译</h3>
            <p>各种语言的翻译</p>
          </a>
        </li>
        <li>
          <a href="https://www.bejson.com/ui/compress_img/" target="_blank">
            <h3 class="color-blue-gradient">图片压缩工具</h3>
            <p>图片压缩</p>
          </a>
        </li>
        <li>
          <a href="https://mp.weixin.qq.com/" target="_blank">
            <h3 class="color-green-dark">微信公众平台</h3>
            <p>微信公众平台</p>
          </a>
        </li>
        <li>
          <a href="https://auth.alipay.com/login/index.htm" target="_blank">
            <h3 class="color-blue-deep4">支付宝开发者平台</h3>
            <p>支付宝开发者平台</p>
          </a>
        </li>
        <li>
          <a href="https://www.apipost.cn/" target="_blank">
            <h3 class="color-orange-dark">Apipost</h3>
            <p>不止于API设计、调试、文档、自动化测试</p>
          </a>
        </li>
        <li>
          <a href="https://apifox.com/" target="_blank">
            <h3 class="color-red-light">Apifox</h3>
            <p>API 设计、开发、测试一体化协作平台</p>
          </a>
        </li>
        <li>
          <a href="https://www.postman.com/" target="_blank">
            <h3 class="color-orange1">Postman</h3>
            <p>API 设计、开发、测试一体化协作平台</p>
          </a>
        </li>
        <li>
          <a href="https://www.iconfont.cn/" target="_blank">
            <h3 class="color-blue-light6">Iconfont</h3>
            <p>矢量图下载平台</p>
          </a>
        </li>
        <li>
          <a href="https://lanhuapp.com/" target="_blank">
            <h3 class="color-blue-light8">蓝湖</h3>
            <p>提效增效，化繁为简</p>
          </a>
        </li>
        <li>
          <a href="https://www.ubuuk.com/" target="_blank">
            <h3 class="color-green-gradient">优波UI</h3>
            <p>丰富的UI设计和素材</p>
          </a>
        </li><li>
          <a href="https://juejin.cn/" target="_blank">
            <h3 class="color-blue-light9">掘金</h3>
            <p>一个信息网站</p>
          </a>
        </li>
        <li>
          <a href="https://www.csdn.net/" target="_blank">
            <h3 class="color-orange1">CSDN</h3>
            <p>博客网站</p>
          </a>
        </li>
        <li>
          <a href="https://pub-web.flutter-io.cn/" target="_blank">
            <h3 class="color-green-gradient4">Dart packages</h3>
            <p>Dart和Flutter应用程序的官方软件包存储库。</p>
          </a>
        </li>
        <li>
          <a href="https://unicloud.dcloud.net.cn/pages/login/login" target="_blank">
            <h3 class="color-green-gradient">Uni服务空间</h3>
            <p>uniCloud Web控制台，JS开发服务端，Serverless云开发</p>
          </a>
        </li>
        <li>
          <a href="https://gitee.com/" target="_blank">
            <h3 class="color-orange-deep">Gitee</h3>
            <p>开源集成平台</p>
          </a>
        </li>
        <li>
          <a href="https://cloud.tencent.com/" target="_blank">
            <h3 class="color-green-gradient4">腾讯云</h3>
            <p>性能强大、安全、稳定的云产品</p>
          </a>
        </li>
        
        <li>
          <a href="https://tooltt.com/json2typescript/" target="_blank">
            <h3 class="color-green-gradient2">JSON转TypeScript</h3>
            <p>在线JSON转typescript工具</p>
          </a>
        </li>
        <li>
          <a href="https://www.json.cn/" target="_blank">
            <h3 class="color-green-deep3">快速JSON</h3>
            <p>快速JSON</p>
          </a>
        </li>
        <li>
          <a href="http://jingweidu.757dy.com/" target="_blank">
            <h3 class="color-black2">经纬度查询定位</h3>
            <p>经纬度查询定位</p>
          </a>
        </li>
        <li>
          <a href="https://www.jyshare.com/front-end/61/" target="_blank">
            <h3 class="color-blue-light2">在线HTML</h3>
            <p>在线HTML 练习</p>
          </a>
        </li>
        <li>
          <a href="https://www.jyshare.com/front-end/854/" target="_blank">
            <h3 class="color-99CCFF">在线正则表达式</h3>
            <p>在线正则表达式</p>
          </a>
        </li>
        <li>
          <a href="https://apis.netstart.cn/#/" target="_blank">
            <h3 class="color-purple-deep">API接口文档</h3>
            <p>可以用于 Vue、React、UniApp、微信小程序等项目练习</p>
          </a>
        </li>
      </ul>
    </div>
  </div>
{{/block}}
